<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单元素</title>
	</head>
	<body>
		<!-- 表单：采集用户信息，并提交到服务器 
		     表单元素：form
		     input控件元素：采集用户信息的元素
			 必须type属性    属性值    text             文本框
			                          password         密文      文本框
									  submit           提交      form表单控制
									  button           按钮      结合JS、value【htm4】
									  reset            重置      form表单控制
									  color            颜色控件
									  datetime-local  本地日历控件
									  date            日期插件
									  time            时间插件
									  week            周插件
									  range           滑块
									  file            上传文件
									  radio           单选框     结合name属性
									  checkbox        复选框
								----  checked  默认选择【单复选框】
								      image           图片按钮   结合src属性
									  hidden          隐藏 结合 JS
		-->
		<h1>登陆页面</h1>
		<form>
			<h4>表单元素：控件元素</h4>
		账号：<input type="text" />    <br><br />
		<input />
		密码：<input type="password"/> <br><br />
		<input type="submit" />
		<input type="button" value="自定义按钮" />
		<!-- htm5写法 结合JS -->
		<button>触发按钮</button>
		<input type="reset" />         <br><br />
		<input type="color" />
		<input type="datetime-local" />
		<input type="date" />
		<input type="time" />
		<input type="week" />
		<input type="range" />
		<input type="file" />
		男<input type="radio" name="sex" checked />
		女<input type="radio" name="sex" />
		<input type="checkbox" />红烧肉
		<input type="checkbox" checked />佛跳墙
		<input type="checkbox" />小鸡炖蘑菇
		<input type="image" src="img/1.png" />
		<input type="hidden" />
		<h4>表单元素：多行文本元素</h4>
		建议：<textarea cols="20" rows="10"></textarea>
		<h4>表单元素：下拉列表：范围内的数据</h4>
		<!-- 快捷键：select>option -->
		发车时间：<select>
			<option>00:00--24:00</option>
			<option>00:00--06:00</option>
			<option>06:00--12:00</option>
			<option>12:00--18:00</option>
			<option>18:00--24:00</option>
		         </select>
		<h4>表单元素：细节元素</h4>
		<!-- 层级元素 快捷键：details>summary+div -->
		<etails>
			<summary>征婚启事</summary>
			<div>Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusantium quasi necessitatibus soluta laudantium ducimus totam atque delectus distinctio. Blanditiis at sapiente debitis perferendis saepe impedit consectetur doloribus! Aspernatur, tempore itaque. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Eius itaque provident quo esse dicta fugiat distinctio modi sint minima! Eaque, in dicta! Voluptatibus perferendis fugit accusamus repellat voluptas praesentium cum. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Veritatis esse, at hic delectus impedit consectetur voluptate. At ullam doloribus, corporis perspiciatis asperiores dicta odit impedit veniam enim consequatur optio dolore! Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsam veniam aperiam asperiores impedit ad adipisci, perspiciatis molestias iusto consequatur magnam cumque veritatis sit nulla quo explicabo aliquam laboriosam aut numquam?</div>
		</etails>
		</form>
		<h1>新元素</h1>
		<!-- 记号笔元素 -->
		周五<mark>放假了</mark>
		<!-- 度量元素 value="0~1默认值" min属性 max属性 -->
		电量：<meter value="80" min="0" max="100"></meter>
		
		
		
		
		
作业<h1>---》求职申请《---</h1>
    <table>
    	<tr>
    		<td>用</td>
    		<td>户</td>
    		<td>名</td>
    		<td>：<input type="text" /></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    	</tr>
    	<tr>
    		<td></td>
    		<td>密</td>
    		<td>码</td>
    		<td>：<input type="text" /></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    	</tr>
    	<tr>
    		<td></td>
    		<td>性</td>
    		<td>别</td>
    		<td>：男<input type="radio" name="sex" />
		女<input type="radio" name="sex" />不透露<input type="radio" name="sex" /></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    	</tr>
    	<tr>
    		<td></td>
    		<td>头</td>
    		<td>像</td>
    		<td>：<input type="button" value="浏览..." />未选择文件</td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
			<td></td>
    	</tr>
    	<tr>
    		<td></td>
			<td></td>
    		<td></td>
    		<td><input type="button" value="提交" /><input type="button" value="清除" /></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    	</tr>
    	<tr>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td><input type="checkbox" />请不要公开我的信息</td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    		<td></td>
    	</tr>
    </table>
	
	
		
	</body>
</html>